<template>
  <a-modal
    v-model:visible="visible"
    :title="title"
    :mask-closable="false"
    @cancel="handleCancel"
    @close="handleCancel"
    @before-ok="handleBeforeOk"
    unmount-on-close
  >
    <div class="font-medium">
      删除车辆将会连带删除此车辆关联的运维单以及运维单的财务数据和待办数据，车辆相关的订单和订单的财务数据仍保留，但会导致被删车辆订单的部分操作无法进行。如需保留此车辆关联的全部数据，请使用车辆【处置】功能
    </div>
    <page-form :model="form" layout="vertical" ref="formRef">
      <a-form-item field="isRead" :rules="[{ type: 'boolean', true: true, message: '请阅读上述风险并完成勾选' }]">
        <a-checkbox v-model="form.isRead"> 我已阅读并知晓风险 </a-checkbox>
      </a-form-item>
    </page-form>
  </a-modal>
</template>

<script setup lang="ts">
  import { ref, computed } from 'vue'
  import { deleteCar } from '@/api/asset/car'
  import { Message } from '@arco-design/web-vue'

  const props = defineProps({
    modelValue: {
      type: Boolean,
      default: false,
    },
    title: {
      type: String,
      default: '确认删除？',
    },
    data: {
      type: Object,
      default: () => ({}),
    },
  })

  const emist = defineEmits(['update:modelValue', 'ok'])
  const visible = computed({
    get: () => props.modelValue,
    set: (value) => emist('update:modelValue', value),
  })
  const form = ref({
    isRead: false,
  })
  const formRef = ref()

  const handleCancel = () => {
    visible.value = false
    form.value.isRead = false
  }

  const handleBeforeOk = () => {
    return new Promise<boolean>((resolve) => {
      formRef.value.validate((error: string) => {
        if (!error) {
          deleteCar({ id: props.data.id })
            .then(() => {
              Message.success('删除成功')
              visible.value = false
              emist('ok')
              resolve(true)
            })
            .catch(() => {
              resolve(false)
            })
        } else {
          resolve(false)
        }
      })
    })
  }
</script>

<style lang="less" scoped></style>
